<template>
    <div class="form1">
        <form action="">
            <h1>在线留言</h1>
            <input type="text" placeholder="您的姓名" v-model="username">
            <input type="text" placeholder="您的手机号码" v-model="phone">
            <textarea name="" placeholder="您的需求" v-model="message"></textarea>
            <div class="button" @click="putInfo()">提交</div>
        </form>
            
    </div>
</template>

<script>
import axios from "axios"
export default {
      name:'IndexFrom',
        
        data (){
            return {
                baseUrl:'http://vuetest.cn/api/v1/',
                username:'',
                phone:'',
                message:'',
                description:'官宣-constact留言'
            }
        },
        methods: {
           putInfo (){
                axios.get(this.baseUrl+'cms/joinAdd',
                {
                    params:{
                        username:this.username,
                        phone:this.phone,
                        message:this.message,
                        description:this.description
                    }
                })
                .then(this.putSucc)
           },
           putSucc(response){
            //    console.log(response)
             const h = this.$createElement;
               if(response.data.errno===0){

                  
                    this.$notify({
          title: '成功提醒',
          type: 'success',
          message: h('i', { style: 'color: teal'}, '留言成功，稍后客服会给你回复，请耐心等待')
        });

                }else if(response.data.errno===1){
                   
                   this.$notify.error({
          title: '错误提醒',
          message: h('i', { style: 'color: teal'}, '该手机号已提交过留言，请等待客服回复')
        });
                }
           }
        },
}
</script>
<style lang="stylus" scoped>
@import '~assets/varibles.styl'
.form1
    width 442px
    margin 0 auto
h1
    color #333333
    font-size 24px
    margin-top 54px
input 
    text-indent 10px
    color #666666
    font-size 14px
    margin-top 23px
    width 442px
    height 50px    
textarea
    text-indent 10px
    background white    
    resize:none
    width 442px
    height 110px   
    margin-top 23px  
.button
    margin-top 18px
    width 442px
    background #00a6b9  
    height 50px 
    line-height 50px
    color white
    font-size 18px   
    cursor pointer  
    margin-bottom 78px                     
</style>
